<!DOCTYPE html>
<html lang="zh"  xmlns:th="http://www.thymeleaf.org" >
<head>
    <meta charset="UTF-8">
    <title>主页</title>
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>
    <style>
        .table-c table{border-right:1px solid #F00;border-bottom:1px solid #F00}
        .table-c table td{border-left:1px solid #F00;border-top:1px solid #F00}

        .ta1{
            width:100px;
        }
        .ta2{
            width: 200px;
        }
    </style>
</head>
<body>


<div id="logs">

</div>

<table class="table-c" style="">

    <tr>
        <td class="ta1">用户名</td>
        <td class="ta2"><input id="username" value="" /></td>
    </tr>
    <tr>
        <td class="ta1">密码</td>
        <td class="ta2"><input id="password" type="password" value="" /></td>
    </tr>


    <tr>
        <td class="ta1">单日最大接单量</td>
        <td class="ta2"><input id="daymax" type="number" value="" /></td>
    </tr>

    <tr>
        <td class="ta1">过滤关键词</td>
        <td class="ta2"><input id="keyWord" placeholder="多个使用(;)隔开" value=""  /></td>
    </tr>
<!--    <tr>-->
<!--        <td class="ta1">货物品种关键词(只抢包含本关键词的)</td>-->
<!--        <td class="ta2"><input id="inKeyWord" placeholder="多个使用(;)隔开" value=""  /></td>-->
<!--    </tr>-->
    <tr>
        <td class="ta1">开关</td>
        <td class="ta2">
            开<input type="radio" id="k" value="1" name="starts" />&nbsp;&nbsp;&nbsp;&nbsp;
            关<input type="radio" id="g" value="0" name="starts" />
        </td>
    </tr>

    <tr>
        <td class="ta1">操作密码</td>
        <td class="ta2"><input id="czpwd" type="text" value="" /></td>
    </tr>
    <tr>
        <td colspan="2">
            <input id="pagesize"  type="hidden" value="" readonly="readonly" />
            <input type="button" onclick="update()" value="修改" />
        </td>

    </tr>
</table>
<div id="tongji">

</div>
<div id="tip" style="color: #FF0000;" >

</div>


<script>



    function update(){
        var obj={};
        obj['username']=$('#username').val();
        obj['password']=$('#password').val();
        obj['pagesize']=$('#pagesize').val();
        obj['daymax']=$('#daymax').val();
        obj['starts']=$("input[name='starts']:checked").val();
        obj['czpwd']=$('#czpwd').val();
        obj['keyWord']=$('#keyWord').val();
        obj['inKeyWord']=$('#inKeyWord').val();


        $.ajax({
            type: "post",
            dataType: 'json',
            url: '/update',
            contentType: 'application/json',
            data: JSON.stringify(obj),
            success: function (res) {
                alert(res.msg);
            }
        });

    }

    function queryDay(){
        $.post("/queryDay",{},function(num){
            $('#logs').html('当日抢到订单数量:'+num);
        });
    }



    $(function () {
        queryDay();

        setInterval(function () {
            queryDay();
            // log1();
            // log2();
        },(1000*20));

        $.post("/query",{},function(res){

            $('#username').val(res.block.username);
            $('#password').val(res.block.password);
            $('#pagesize').val(res.block.pagesize);
            $('#daymax').val(res.block.daymax);
            $('#keyWord').val(res.block['keyWord']);
            $('#inKeyWord').val(res.block['inKeyWord']);




            $('#tip').html(res.block["tip"]);

            if(res.block.starts==0){
                $("#g").attr("checked","checked");
            }else{
                $("#k").attr("checked","checked");
            }

            $('#tongji').html(res['qdl']);

        });



    });
    
</script>


</body>
</html>